<!--  -->
<template>
  <div class=''>
    <basic-container>
      <avue-crud
        ref="crud"
        :page.sync="page"
        :data="tableData"
        :table-loading="tableLoading"
        :option="tableOptions"
        @on-load="getList"
        @size-change="sizeChange"
        @current-change="currentChange"
        @search-change="searchChange"
        @search-reset='searchReset'
        @refresh-change='refreshChange'
      >
        <template
          slot="sum"
          slot-scope="scope"
        >
          {{(scope.row.waterAndElectricity+scope.row.managementMoney+scope.row.rent+scope.row.carMoney+scope.row.otherMoney) | TofiexdNumber}}
        </template>
        <template
          slot-scope="scope"
          slot="paymentTimeSearch"
        >
          <el-date-picker
            v-model="searchForm.time"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            format="yyyy-MM-dd"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </template>
        <template
          slot-scope="scope"
          slot="searchMenu"
        >
          <el-button
            size="small"
            icon="el-icon-download"
            @click="ExportFile"
          >导出</el-button>
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
import { dayData } from '@/const/crud/datareport/index'
import { datePage } from '@/api/datareport/index'
import { ExportFile } from '@/api/common'
export default {
  // import引入的组件需要注入到对象中才能使用
  components: {},
  data () {
    // 这里存放数据
    return {
      searchForm: {
        time: []
      },
      timeStart:'',
      timeEnd:'',
      optionsList: [],
      tableData: [],
      tableLoading: false,
      tableOptions: dayData,

      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20 // 每页显示多少条
      }
    }
  },
  filters: {
    TofiexdNumber (value) {
      return value.toFixed(2)
    }
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 方法集合
  methods: {
    ExportFile () {
      console.log(this.searchForm);
      let data = new Date();
      data.setTime(data.getTime()-24*60*60*1000);
      let time1 = data.getFullYear()+"-" + (data.getMonth()+1) + "-" + (data.getDate()+1);
      console.log(time1);
      if (this.searchForm.time.length) {
        console.log(1);
        ExportFile('/cost/dailyCost/export', { timeStart: this.searchForm.time[0], timeEnd: this.searchForm.time[1] }).then(response => {
          console.log(response)
        })
      } else {
        console.log(2);
        ExportFile('/cost/dailyCost/export', { timeStart: time1, timeEnd: time1 }).then(response => {
          console.log(response)
        })
      }
      
    },
    getList (page, params) {
      if (this.searchForm.time.length) {
        this.timeStart = this.searchForm.time[0]
        this.timeEnd = this.searchForm.time[1]
      } else {
        this.timeStart = ''
        this.timeEnd = ''
      }
      // return;
      datePage(Object.assign({
        current: this.page.currentPage,
        size: this.page.pageSize,
        timeStart:this.timeStart,
        timeEnd:this.timeEnd,
        // companyName:'',
      }, params,)).then(response => {
        this.tableData = [];
         this.tableData = response.data.data.records;
        this.page.total = response.data.data.total
        this.tableLoading = false
      }).catch(() => {
        this.tableLoading = false
      })
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize
    },
    currentChange (current) {
      this.page.currentPage = current
    },
    searchChange (form, done) {
      this.page.currentPage = 1
      this.getList(this.page, form)
      done()
    },
    refreshChange () {
      this.getList(this.page)
    },
    searchReset () {
      this.searchForm.time = []
      this.getList(this.page)
    }
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created () {

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted () {

  },
  beforeCreate () { }, // 生命周期 - 创建之前
  beforeMount () { }, // 生命周期 - 挂载之前
  beforeUpdate () { }, // 生命周期 - 更新之前
  updated () { }, // 生命周期 - 更新之后
  beforeDestroy () { }, // 生命周期 - 销毁之前
  destroyed () { }, // 生命周期 - 销毁完成
  activated () { } // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
</style>